<!DOCTYPE html>
<html xmlns:v-bind="http://www.w3.org/1999/xhtml" xmlns:v-on="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" type="text/css" href="../lib/elementui/1.4.3/theme-default/index.css">
    <script src="../lib/elementui/1.4.3/index.js"></script>
</head>

<body>
<div id="showGoodsList">

    <div class="wrap-list">
        <el-form :inline="true" ref="form" :model="fromCondition" label-width="80px" size="mini"
                 class="demo-form-inline">

            <el-row>
                <el-col :span="5">
                    <el-form-item label="商品名称">
                        <el-input v-model="fromCondition.name"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="5">
                    <el-form-item label="商品品牌">
                        <el-input v-model="fromCondition.brand"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="5">
                    <el-form-item label="商品型号">
                        <el-input v-model="fromCondition.model"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="4">
                    <el-button type="primary" @click="onSubmit">立即查询</el-button>
                </el-col>
                <el-col :span="5">
                    <el-upload
                            class="upload-excel"
                            action="/home/merchant/submitUpload"
                            list-type="text"
                            :data="shopId"
                            :on-success="excelSuccess"
                            :before-upload="excelUpload"
                            :on-error="excelError">
                        <el-button  type="primary">ecxel导入商品信息</el-button>
                        <div slot="tip" class="el-upload__tip">只能上传excel文件</div>
                    </el-upload>
                </el-col>
            </el-row>


        </el-form>

        <template>
            <el-tabs v-model="activeName" @tab-click="handleClick">
                <el-tab-pane label="上架商品" name="1">
                    <el-table :data="CommodityList2.slice((currentPage1-1)*pagesize,currentPage1*pagesize)" border stripe width="100%" height="630"  align="center">
                        <el-table-column prop="masterMap"  label="图片" show-overflow-tooltip align="center">
                            <template slot-scope="scope">
                                <img :src="scope.row.masterMap" @click="openWindow(scope.row)" :title="scope.row.commodityName"  alt="" style="width: 40px;">
                            </template>
                        </el-table-column>
                        <el-table-column prop="commodityName" label="商品名称" align="center"></el-table-column>
                        <el-table-column prop="commodityTrcPrc" label="商品价格" align="center"></el-table-column>
                        <el-table-column prop="brand" label="所属品牌" align="center"></el-table-column>
                        <el-table-column prop="model" label="商品型号" align="center"></el-table-column>
                        <el-table-column prop="stock" label="库存" align="center"></el-table-column>
                        <el-table-column prop="" label="操作" align="center">
                            <template slot-scope="scope">
                                <el-button @click="compile(scope.row)" type="success" size="small">编辑</el-button>
                                <a href="javascript:void(0);"><el-tag v-if="scope.row.install==0" @click.native="operation(scope.row,2)">上架</el-tag></a>
                                <el-tag v-if="scope.row.install==2" style="background: none;color:#4d4d4d">待审批</el-tag>
                                <a href="javascript:void(0);"><el-tag v-if="scope.row.install==1" @click.native="operation(scope.row,0)">下架</el-tag></a>
                            </template>
                        </el-table-column>
                    </el-table>
                    <template>
                    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange(currentPage1,0)"   :page-sizes="[10, 20, 30, 40]" :current-page.sync="currentPage1" :page-size="pagesize" layout="total, prev, pager, next" :total="CommodityList2.length" align="right" style="margin-right: 50px;"></el-pagination>
                    </template>
                </el-tab-pane>
                <el-tab-pane label="下架商品" name="0">
                    <el-table :data="CommodityList1.slice((currentPage2-1)*pagesize,currentPage2*pagesize)" border stripe width="100%" height="630"   align="center">
                        <el-table-column prop="masterMap"  label="图片" show-overflow-tooltip align="center">
                            <template slot-scope="scope">
                                <img :src="scope.row.masterMap" @click="openWindow(scope.row)" :title="scope.row.commodityName"  alt="" style="width: 40px;">
                            </template>
                        </el-table-column>
                        <el-table-column prop="commodityName" label="商品名称" align="center"></el-table-column>
                        <el-table-column prop="commodityTrcPrc" label="商品价格" align="center"></el-table-column>
                        <el-table-column prop="brand" label="所属品牌" align="center"></el-table-column>
                        <el-table-column prop="model" label="商品型号" align="center"></el-table-column>
                        <el-table-column prop="stock" label="库存" align="center"></el-table-column>
                        <el-table-column prop="" label="操作" align="center">
                            <template slot-scope="scope">
                                <el-button @click="compile(scope.row)" type="success" size="small">编辑</el-button>
                                <a href="javascript:void(0);"><el-tag v-if="scope.row.install==0" @click.native="operation(scope.row,2)">上架</el-tag></a>
                                <el-tag v-if="scope.row.install==2" style="background: none;color:#4d4d4d">待审批</el-tag>
                                <a href="javascript:void(0);"><el-tag v-if="scope.row.install==1" @click.native="operation(scope.row,0)">下架</el-tag></a>
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange(currentPage2,1)"   :page-sizes="[10, 20, 30, 40]" :current-page.sync="currentPage2" :page-size="pagesize" layout="total, prev, pager, next" :total="CommodityList1.length" align="right" style="margin-right: 50px;"></el-pagination>
                </el-tab-pane>
                <el-tab-pane label="待审批商品" name="3">
                    <el-table :data="CommodityList4.slice((currentPage4-1)*pagesize,currentPage4*pagesize)" border stripe width="100%" height="630"   align="center">
                        <el-table-column prop="masterMap"  label="图片" show-overflow-tooltip align="center">
                            <template slot-scope="scope">
                                <img :src="scope.row.masterMap" @click="openWindow(scope.row)" :title="scope.row.commodityName" alt="" style="width: 40px;">
                            </template>
                        </el-table-column>
                        <el-table-column prop="commodityName" label="商品名称" align="center"></el-table-column>
                        <el-table-column prop="commodityTrcPrc" label="商品价格" align="center"></el-table-column>
                        <el-table-column prop="brand" label="所属品牌" align="center"></el-table-column>
                        <el-table-column prop="model" label="商品型号" align="center"></el-table-column>
                        <el-table-column prop="stock" label="库存" align="center"></el-table-column>
                        <el-table-column prop="" label="操作" align="center">
                            <template slot-scope="scope">
                                <el-button @click="compile(scope.row)" type="success" size="small">编辑</el-button>
                                <a href="javascript:void(0);"><el-tag v-if="scope.row.install==0" @click.native="operation(scope.row,2)">上架</el-tag></a>
                                <el-tag v-if="scope.row.install==2" style="background: none;color:#4d4d4d">待审批</el-tag>
                                <a href="javascript:void(0);"><el-tag v-if="scope.row.install==1" @click.native="operation(scope.row,0)">下架</el-tag></a>
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange(currentPage4,2)"    :page-sizes="[10, 20, 30, 40]" :current-page.sync="currentPage4" :page-size="pagesize" layout="total, prev, pager, next" :total="CommodityList4.length" align="right" style="margin-right: 50px;"></el-pagination>
                </el-tab-pane>
                <el-tab-pane label="审批中商品" name="2">
                    <el-table :data="CommodityList3.slice((currentPage3-1)*pagesize,currentPage3*pagesize)" border stripe width="100%" height="630"   align="center">
                        <el-table-column prop="masterMap"  label="图片" show-overflow-tooltip align="center">
                            <template slot-scope="scope">
                                <img :src="scope.row.masterMap" @click="openWindow(scope.row)" :title="scope.row.commodityName" alt="" style="width: 40px;">
                            </template>
                        </el-table-column>
                        <el-table-column prop="commodityName" label="商品名称" align="center"></el-table-column>
                        <el-table-column prop="commodityTrcPrc" label="商品价格" align="center"></el-table-column>
                        <el-table-column prop="brand" label="所属品牌" align="center"></el-table-column>
                        <el-table-column prop="model" label="商品型号" align="center"></el-table-column>
                        <el-table-column prop="stock" label="库存" align="center"></el-table-column>
                        <el-table-column prop="" label="操作" align="center">
                            <template slot-scope="scope">
                                <el-button @click="compile(scope.row)" type="success" size="small">编辑</el-button>
                                <a href="javascript:void(0);"><el-tag v-if="scope.row.install==0" @click.native="operation(scope.row,2)">上架</el-tag></a>
                                <el-tag v-if="scope.row.install==2" style="background: none;color:#4d4d4d">待审批</el-tag>
                                <a href="javascript:void(0);"><el-tag v-if="scope.row.install==1" @click.native="operation(scope.row,0)">下架</el-tag></a>
                            </template>
                        </el-table-column>
                    </el-table>
                    <template>
                    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange(currentPage3,3)"   :page-sizes="[10, 20, 30, 40]" :current-page.sync="currentPage3" :page-size="pagesize" layout="total, prev, pager, next" :total="CommodityList3.length" align="right" style="margin-right: 50px;"></el-pagination>
                        </template>
                </el-tab-pane>

            </el-tabs>
        </template>


        <el-dialog title="修改主图信息，建议大小800*800" :visible.sync="dialogFormVisible">
            <el-upload
                    class="upload-demo"
                    action="/home/commodity/uploadPicture"
                    list-type="text"
                    :data="map"
                    :on-success="handleAvatarSuccess"
                    :before-upload="beforeAvatarUpload"
                    :on-error="handleAvatarError">
                <el-button size="small" type="primary">点击修改</el-button>
                <div slot="tip" class="el-upload__tip">只能上传jpg/png文件</div>
            </el-upload>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
            </div>
        </el-dialog>
    </div>


</div>

<script src="../charge/showGoodsList.js"></script>
</body>

</html>